<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>healthform</title>
    <link rel="stylesheet" href="https://www.layuicdn.com/layui-v2.6.8/css/layui.css">
</head>
<body>

<form  method="get" id="searchHealthform">
    <p>查找的id<input type="text" name="hno" class="layui-input" style="width: 150px;border-color: black"/></p>
    <input type="button" id="search" value="查找" class="layui-btn layui-btn-primary"/>
</form>

<div id="sr" hidden>
    <label>体检编号:</label><span id="shno"></span><br>
    <label>学生编号:</label><span id="ssno"></span><br>
    <label>身高:</label><span id="sheight"></span><br>
    <label>体重:</label><span id="sweight"></span><br>
    <label>胸围:</label><span id="schest"></span><br>
</div>


<form method="get" id="deleteHealthform">
    <p>删除的id<input type="text" name="hno" class="layui-input" style="width: 150px;border-color: black"/></p>
    <input type="button" id="delete" value="删除" class="layui-btn layui-btn-primary"/>
</form>

<div id="dr" hidden>
<label>message:</label><span id="dmessage"></span><br>
</div>


<form method="get" id="addHealthform">
    <p>学生编号<input type="text" name="sno"  class="layui-input" style="width: 150px;border-color: black"/></p>
    <p>身高<input type="text" name="height"  class="layui-input" style="width: 150px;border-color: black"/></p>
    <p>体重<input type="text" name="weight"  class="layui-input" style="width: 150px;border-color: black"/></p>
    <p>胸围<input type="text" name="chest"  class="layui-input" style="width: 150px;border-color: black"/></p>
    <input type="button" id="add" value="添加" class="layui-btn layui-btn-primary"/>
</form>

<div id="ar" hidden>
<label>体检编号:</label><span id="ahno"></span><br>
<label>学生编号:</label><span id="asno"></span><br>
<label>身高:</label><span id="aheight"></span><br>
<label>体重:</label><span id="aweight"></span><br>
<label>胸围:</label><span id="achest"></span><br>
</div>


<form method="get" id="updateHealthform">
    <p>体检编号<input type="text" name="hno" class="layui-input" style="width: 150px;border-color: black"/></p>
    <p>学生编号<input type="text" name="sno" class="layui-input" style="width: 150px;border-color: black"/></p>
    <p>身高<input type="text" name="height" class="layui-input" style="width: 150px;border-color: black"/></p>
    <p>体重<input type="text" name="weight" class="layui-input" style="width: 150px;border-color: black"/></p>
    <p>胸围<input type="text" name="chest" class="layui-input" style="width: 150px;border-color: black"/></p>
    <input type="button" id="update" value="更新" class="layui-btn layui-btn-primary"/>
</form>

<div id="ur" hidden>
<label>体检编号:</label><span id="uhno"></span><br>
<label>学生编号:</label><span id="usno"></span><br>
<label>身高:</label><span id="uheight"></span><br>
<label>体重:</label><span id="uweight"></span><br>
<label>胸围:</label><span id="uchest"></span><br>
</div>


<script src="https://www.layuicdn.com/layui/layui.js"></script>
<script>
    layui.use(['layer', 'jquery'], function(){
        var layer = layui.layer //获得 layer 模块
            ,$ = layui.jquery //获得 jquery 模块

        $("#search").click(function () {
            $.get("[[@{healthform/selectOne}]]", $("#searchHealthform").serialize(),
                function(data){
                    $("#shno").text(data.hno);
                    $("#ssno").text(data.sno);
                    $("#sheight").text(data.height);
                    $("#sweight").text(data.weight);
                    $("#schest").text(data.chest);
                    layer.open({
                        type: 1,
                        content: $('#sr')
                    });
                });
        })

        $("#delete").click(function () {
            $.get("[[@{healthform/deleteOne}]]", $("#deleteHealthform").serialize(),
                function(data){
                    $("#dmessage").text(data);
                    layer.open({
                        type: 1,
                        content: $('#dr')
                    });
                });
        })

        $("#add").click(function () {
            $.get("[[@{healthform/addOne}]]", $("#addHealthform").serialize(),
                function(data){
                    console.log(data);
                    $("#ahno").text(data.hno);
                    $("#asno").text(data.sno);
                    $("#aheight").text(data.height);
                    $("#aweight").text(data.weight);
                    $("#achest").text(data.chest);
                    layer.open({
                        type: 1,
                        content: $('#ar')
                    });
                });
        })


        $("#update").click(function () {
            $.get("[[@{healthform/updateOne}]]", $("#updateHealthform").serialize(),
                function(data){
                    $("#uhno").text(data.hno);
                    $("#usno").text(data.sno);
                    $("#uheight").text(data.height);
                    $("#uweight").text(data.weight);
                    $("#uchest").text(data.chest);
                    layer.open({
                        type: 1,
                        content: $('#ur')
                    });
                });
        })
    });
    </script>

</body>
</html>